<template>
	<view>
		<view class="flex selectNav">
			<view><text class="selectbottom">综合</text></view>
			<view><text>销量</text></view>
			<view><text class="changeImg"></text><text class="icon_shai">筛选</text></view>
		</view>
		<!-- 综合 -->
		<view class="alap"></view>
		<view class="select1_con">
			<view :class="'list '+(curIndex == index?'cur':'')" v-for="(item,index) in list" @tap="clickSelect(index)">87887</view> 
		</view>
		<!-- 综合end -->
	</view>
</template>

<script>
	export default{
		data(){ 
			return{
				list:[{},{},{}],
				curIndex:0
			}
			
		},
		methods:{
			clickSelect:function(index){
				this.curIndex = index
			}
		}
	}
</script>

<style>
	@import url("css/common.css");
	.selectNav{
		justify-content: space-around;
		font-size:24rpx;
		height: 73rpx;
		line-height: 73rpx;
		background-color: #fff;
	}
	.selectNav .selectbottom{
		padding-right: 30rpx;
		background: url(static/selectbottom.png) right center no-repeat;
	}
	.selectNav .icon_shai{
		padding-right: 30rpx;
		background: url(static/icon_select.png) right center no-repeat;
		background-size: 21rpx 20rpx;
		padding-left: 20rpx;
		border-left: 1rpx solid #eee;
	}
	.selectNav .changeImg{
		padding: 20rpx;
		background: url(static/icon_list.png) center no-repeat;
		background-size: 25rpx 26rpx;
		margin-right: 20rpx;
	}
	.alap{
		width: 100%;
		height: 100%;
		position: fixed;
		top:280rpx;
		left: 0;
		z-index: 1;
		background-color: rgba(0,0,0,0.6);
	}
	.select1_con{
		position: absolute;
		top:280rpx;
		left: 0;
		background-color: #fff;
		z-index: 9;
		width: 100%; 
	}
	.select1_con .list{
		font-size:24rpx; 
		color:rgba(51,51,51,1);
		border-bottom: 1rpx solid #F1F1F1; 
		height: 80rpx;
		line-height: 80rpx;
		padding: 0 20rpx; 
	}
	.select1_con .list.cur{
		color: rgba(6,193,174,1);
		/* background: url(static/icon_selected.png) right 20rpx center no-repeat; */
	}
</style>
